﻿<template>
  <div>
    <!-- 标题部分 -->
    <V-Title :titleName = 'titleName'></V-Title>
    <!-- 表格部分 -->
    <div class = 'page_mainContent'>
      <div class = 'page_tableContent'>
        <el-table :data = 'table.tableData' style = 'width:100%' stripe border>
          <el-table-column align = 'center' v-for = 'item in table.tableColumn' :key = 'item.indexName' :label = 'item.text'>
            <template slot-scope = 'scope'>
              <span>{{scope.row[item.indexName]}}</span>
            </template>
          </el-table-column>
          <el-table-column label = "操作" align = "center" width = '260px'>
            <template slot-scope = "scope">
              <el-button type = 'text' @click = "handleAsign(scope.row)"><i class = 'iconfont icon-geren'></i>角色授权</el-button>
              <el-button type = 'text' @click = "handleFunc(scope.row)"><i class = 'iconfont icon-lock'></i>功能授权</el-button>
            </template>
          </el-table-column>
        </el-table>
      </div>
    </div>
    <!-- 选择登录账号的弹出窗 -->
    <V-Select :roles = 'roles' :showDialog = 'showDialog' @giveUp = 'showDialog=false' @sureSelect = 'sureSelect'></V-Select>
    <!-- 选择功能的弹窗 -->
    <V-Func :roles = 'roles' :funcDialog = 'funcDialog' @giveUpFunc = 'funcDialog=false' @sureFuncSelect = 'sureFuncSelect'></V-Func>
  </div>
</template>

<script>
import VTitle from '@/components/common/MainTitle.vue'
import VSelect from './SelectLoginNo.vue'
import VFunc from './FunctionSelect'
export default {
  data () {
    return {
      titleName: '角色权限管理',
      table: {
        tableData: [],
        tableColumn: [
          {
            text: '角色编号',
            indexName: 'roleno'
          },
          {
            text: '角色名称',
            indexName: 'rolename'
          }
        ]
      },
      showDialog: false,
      funcDialog: false,
      currentRole: '',
      selectId: [],
      roles: ''
    }
  },
  created () {
    this.getTableData()
  },
  methods: {
    getTableData () {
      this.$get('/role').then((data) => {
        if (data.status === 200) {
          this.table.tableData = []
          data.data.result.forEach(item => {
            if (this.$store.state.roleNo && this.$store.state.roleNo.indexOf('R999') !== -1) { // 超级管理员展示所有的
              this.table.tableData.push(item)
            } else {
              // 不显示超级管理员
              if (item.roleno !== 'R999') {
                this.table.tableData.push(item)
              }
            }
          })
        }
      }).catch((error) => {
        console.log(error)
      })
    },
    // 点击角色授权时
    handleAsign (row) {
      this.currentRole = row
      this.roles = row.roleno
      this.showDialog = true
    },
    // 提交角色授权时
    sureSelect (selectRows) {
      if (selectRows.length) {
        this.selectId = []
        selectRows.forEach(val => {
          if (val.loginuid) {
            this.selectId.push(val.loginuid)
          } else if (val.uid) {
            this.selectId.push(val.uid)
          }
        })
        this.$post('/roleauth/login2role', {
          loginuid: this.selectId.join(),
          roleno: this.currentRole.roleno
        }).then(data => {
          if (data.data.result.code === 'success') {
            this.showDialog = false
            this.$message({
              message: '角色授权成功！',
              type: 'success'
            })
          }
        }).catch(error => {
          console.log(error)
        })
      } else {
        this.$message({
          message: '请选择需要指定角色的账号',
          type: 'warning'
        })
      }
    },
    // 点击功能授权时
    handleFunc (row) {
      this.currentRole = row
      this.roles = row.roleno
      this.funcDialog = true
    },
    // 提交功能授权时
    sureFuncSelect (selectRows, totalFuncs) {
      if (selectRows.length) {
        this.selectId = []
        selectRows.forEach(val => {
          this.selectId.push(val.functionno)
        })
        this.$post('/roleauth/rolefunction', {
          roleno: this.currentRole.roleno,
          functionnos: this.selectId.join()
        }).then(data => {
          if (data.data.result.code === 'success') {
            this.funcDialog = false
            this.$message({
              message: '功能授权成功!',
              type: 'success'
            })
          }
        }).catch(error => {
          console.log(error)
        })
      } else {
        if (totalFuncs.length) {
          this.selectId = []
          totalFuncs.forEach(val => {
            this.selectId.push(val.functionno)
          })
          this.$delete('/roleauth/rolefunction', {
            data: {
              roleno: this.currentRole.roleno,
              functionnos: this.selectId.join()
            }
          }).then(data => {
            if (data.status === 204) {
              this.funcDialog = false
              this.$message({
                message: '功能授权成功！',
                type: 'success'
              })
            }
          }).catch(error => {
            console.log(error)
          })
        }
      }
    }
  },
  components: {
    VTitle,
    VSelect,
    VFunc
  }
}
</script>
